<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>KSA管理 - KSA评估系统</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <link rel="stylesheet" href="../css/styles.css">
</head>
<body class="bg-gray-100">
    <div class="container mx-auto px-4 py-8">
        <!-- 顶部导航 -->
        <nav class="bg-white shadow-lg rounded-lg mb-8">
            <div class="max-w-7xl mx-auto px-4">
                <div class="flex justify-between h-16">
                    <div class="flex items-center space-x-4">
                        <a href="../index.html" class="text-gray-600 hover:text-gray-800">
                            <i class="fas fa-home mr-2"></i>首页
                        </a>
                        <span class="text-gray-400">/</span>
                        <span class="text-gray-800">KSA管理</span>
                    </div>
                    <div class="flex items-center">
                        <button class="text-gray-600 hover:text-gray-800 mr-4">
                            <i class="fas fa-bell"></i>
                        </button>
                        <button class="text-gray-600 hover:text-gray-800">
                            <i class="fas fa-user-circle"></i>
                        </button>
                    </div>
                </div>
            </div>
        </nav>

        <!-- KSA管理内容 -->
        <div class="bg-white rounded-lg shadow-lg p-6">
            <!-- 岗位选择 -->
            <div class="mb-6">
                <label class="block text-gray-700 mb-2">选择岗位</label>
                <select class="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500">
                    <option>电子电器工程师</option>
                    <option>车身设计师</option>
                    <option>底盘工程师</option>
                </select>
            </div>

            <!-- 职责列表 -->
            <div class="space-y-6">
                <div class="border rounded-lg p-4">
                    <h3 class="text-lg font-semibold mb-4">职责1：系统设计</h3>
                    <div class="space-y-4">
                        <!-- 任务1 -->
                        <div class="border-l-4 border-blue-500 pl-4">
                            <h4 class="font-medium mb-2">任务1：电路设计</h4>
                            <div class="space-y-4 ml-4">
                                <!-- KSA项 -->
                                <div class="flex items-center justify-between">
                                    <div class="flex items-center">
                                        <input type="checkbox" class="mr-2">
                                        <span class="text-gray-700">电路原理知识</span>
                                    </div>
                                    <div class="flex items-center space-x-2">
                                        <span class="text-sm text-gray-500">评估标准：考试</span>
                                        <button class="text-blue-500 hover:text-blue-600">
                                            <i class="fas fa-edit"></i>
                                        </button>
                                    </div>
                                </div>
                                <div class="flex items-center justify-between">
                                    <div class="flex items-center">
                                        <input type="checkbox" class="mr-2">
                                        <span class="text-gray-700">PCB设计技能</span>
                                    </div>
                                    <div class="flex items-center space-x-2">
                                        <span class="text-sm text-gray-500">评估标准：上级考核</span>
                                        <button class="text-blue-500 hover:text-blue-600">
                                            <i class="fas fa-edit"></i>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- 任务2 -->
                        <div class="border-l-4 border-green-500 pl-4">
                            <h4 class="font-medium mb-2">任务2：系统集成</h4>
                            <div class="space-y-4 ml-4">
                                <!-- KSA项 -->
                                <div class="flex items-center justify-between">
                                    <div class="flex items-center">
                                        <input type="checkbox" class="mr-2">
                                        <span class="text-gray-700">系统架构知识</span>
                                    </div>
                                    <div class="flex items-center space-x-2">
                                        <span class="text-sm text-gray-500">评估标准：考试</span>
                                        <button class="text-blue-500 hover:text-blue-600">
                                            <i class="fas fa-edit"></i>
                                        </button>
                                    </div>
                                </div>
                                <div class="flex items-center justify-between">
                                    <div class="flex items-center">
                                        <input type="checkbox" class="mr-2">
                                        <span class="text-gray-700">问题解决能力</span>
                                    </div>
                                    <div class="flex items-center space-x-2">
                                        <span class="text-sm text-gray-500">评估标准：自评/他评</span>
                                        <button class="text-blue-500 hover:text-blue-600">
                                            <i class="fas fa-edit"></i>
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- 操作按钮 -->
            <div class="flex justify-end space-x-4 mt-6">
                <button class="px-4 py-2 bg-gray-200 text-gray-700 rounded-lg hover:bg-gray-300">
                    编辑
                </button>
                <button class="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600">
                    保存
                </button>
                <button class="px-4 py-2 bg-green-500 text-white rounded-lg hover:bg-green-600">
                    提交
                </button>
            </div>
        </div>
    </div>
</body>
</html> 